<template>
  <div class="home">
    <div class="header">
      <van-nav-bar :title="this.$route.meta.title || '浦发硅谷银行'" left-arrow @click-left="onBack">
        <template #left>
          <span class="back"></span>
        </template>
      </van-nav-bar>
    </div>
    <div class="content">
      <router-view/>
    </div>
  </div>
</template>

<script>
// @ is an alias to /src
import {
  Swipe,
  SwipeItem,
  NoticeBar,
  Grid,
  GridItem,
  Tabbar,
  TabbarItem
} from 'vant';

export default {
  name: 'Home',
  components: {
    [Swipe.name]: Swipe,
    [SwipeItem.name]: SwipeItem,
    [NoticeBar.name]: NoticeBar,
    [Grid.name]: Grid,
    [GridItem.name]: GridItem,
    [Tabbar.name]: Tabbar,
    [TabbarItem.name]: TabbarItem
  },
  data() {
    return {};
  },
  methods: {
    onBack() {
      this.$router.back();
    }
  },
  mounted() {}
};
</script>

<style lang="less">
.home{
  .header{
    .back {
      width: 1.375rem;
      height: 1.375rem;
      display: inline-block;
      vertical-align: middle;
      background-size: 1.375rem 1.375rem;
      background-image: url('../assets/img/page/chevron@2x.png');
      background-repeat: no-repeat;
    }
  }
  .content{
    height: calc(100vh - 46PX);
    overflow-y: auto;
  }
}
</style>
